<template>

    <div>
    <el-card class="box-card">
      <div slot="header" class="clearfix">用户登录</div>
      <el-form ref="form" :model="login" label-width="80px">
        <el-form-item label="账号">
          <el-input v-model="login.tel"></el-input>
        </el-form-item>
        <el-form-item label="密码">
          <el-input
            placeholder="请输入密码"
            v-model="login.password"
            show-password
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="loginDo">登录</el-button>
          <el-button>取消</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>

</template>

<script>
export default {
  data() {
    return {
        login:{}
    };
  },
  methods: {
    loginDo(){
        this.$axios.post("/users/loginDo",this.login)
        .then(response=>{
            if(response.data.code == 200){
                sessionStorage.setItem("menuList",JSON.stringify(response.data.data.menuList));
                this.$router.push("/index");
            } else {
                this.$message.error("账号或密码有误，请检查后重新登录");
            }
        })
    }
  },
};
</script>
<style>
  .text {
    font-size: 14px;
  }

  .item {
    margin-bottom: 18px;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both
  }

  .box-card {
    margin: 100px auto;
    width: 480px;
  }
</style>